:root {
  --vh: 100%;
}

html,
body {
   height: 100vh;
   height: var(--vh);
}

.borderd {
  border: 1px solid #ddd;
  border-radius: 5px;
}
.address_copy{
  width:100%;
  padding:10px 0;
}
.address_copy li{
  display:flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom:8px;
}
.address_copy li p{
  font-size:14px;
  color:var(-gray44);
  line-height:1.5;
  width:calc(100% - 80px);
}
.address_copy li span{
  background:var(--gray66);
  color:var(--whiteff);
  font-size:14px;
  padding:5px 15px;
  border-radius: 4px;;
}

.question_btn{
  display:flex;
  gap:10px;
  align-items: center;
  justify-content: space-between;
  margin-bottom:20px;
}
.question_btn button{
  flex:1;
  padding:6px 0;
  color:var(--surfcolor);
  border:1px solid var(--surfcolor);
}
.map_view{
  width:calc(100% - 40px);
  max-width: 728px;
  max-height:calc(100% - 210px);
  height:calc(100vh - 210px); 
  position:fixed;
  bottom:0;
  overflow: hidden;
}
/* .map_view iframe{
  position:fixed;
  bottom:0;
  width:100%;
  max-width: 768px;;
} */

.location_info{
  width:88%;
  max-width: 700px;
  height:150px;
  padding:30px 20px 20px;
  box-shadow: 3px 5px 20px rgba(110,110,110,.3);
  border-radius: 5px;
  background:#fff;
  transition:.5s;
  display: flex;
  gap:10px;;
  position:relative;
  box-sizing: border-box;
  position:fixed;
  bottom:0;
  left:50%;
  transform: translateX(-50%);
}
.location_info .img_box{
  width:100px;
  height:100px;
  position:relative;
}
.location_info .img_box img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.location_info .img_box span.count{
  padding:4px;
  background:rgba(0,0,0,.5);
  border-radius: 2px;
  color:var(--whiteff);
  position:absolute;
  right:0;
  bottom:0;
}
.location_info .ment_box{
  width: calc(100% - 110px);
  height: 110px;
  overflow-y: scroll;
}
.location_info .ment_box p{
  line-height:1.5;
  color: var(--gray66);
  font-size:14px;
}
.location_info .top_slide{
  width:20px;
  height:20px;
  background:url(/common/images/arrow-down.svg?v=1) center no-repeat;
  background-size:13px;
  position:absolute;
  top:3px;
  left:50%;
  transform: translateX(-50%);
}

.location_info .top_slide.onSlide{
background:url(../images/arrow-up.svg) center no-repeat;
background-size:13px;
}

.location_info.onSlide{
  height:30px;
  padding:40px 20px 0;
}

.question_map h4{
  font-size:16px;
  color:var(--black22);
  font-weight: 600;;
}
.question_map .question_info{
  padding:40px;
  text-align: center;
}
.question_map .question_info h4{
  font-size:20px;
  font-weight: 900;
  color: #1975a0;
  margin-bottom:5px;
}
.question_map .question_info span{
  color:var(--gray66);
  font-size:17px;
}
.question_map .question_info p{
  margin-top:20px;
  font-size:15px;
  color: var(--gray44);
}
.question_map .loca_pop_btn{
  margin-top:20px;
}
.question_map .loca_pop_btn button{
  width:100%;
  height:35px;
  text-align: center;
  background:var(--graydd);
  color:var(--gray44);
  border-radius: 5px;
  font-size:14px;;
}

.detail_box .scroll{
  height:400px;
  overflow-y:scroll;
}
.detail_box .detail_ment{
  width:100%;
  margin-bottom:20px;
}
.detail_box .detail_ment .img_box{
  width:100%;
  height:0;
  padding-bottom:56.55%;
  position:relative;
  margin-bottom:10px;
}
.detail_box .detail_ment .img_box img{
  width:100%;
  height:100%;
  object-fit: cover;
  position:absolute;
}
.detail_box .detail_ment p{
  font-size:14px;
  line-height:1.5;
  color:var(--gray44);
}